{block name=report-classes}
<div class="form">
  <form class="form reports-admin top10 form-inline" role="form" id="filter-form">
    {include file='reports/input/filters.tpl'}
	  <div class="form-group col-sm-6 text-center">
			<label class="" for="from">From:</label> 
			<input type="text" class="form-control dates" value="{'-1 month'|date_format:"%Y-%m-%d"}" name="sms_start_date" id="sms_start_date" required>
		</div>
		<div class="form-group col-sm-6 text-center">
			<label class="" for="to">To:</label> 
			<input type="text" class="form-control dates" value="{$smarty.now|date_format:"%Y-%m-%d"}" name="sms_end_date" id="sms_end_date" required>
		</div>
		
	  <div class="row">
      <div class="col-sm-12">
    		<a href="javascript:void(0);" onClick="loadSMSUsageReport($(this).closest('form'));" class="btn btn-info report-green">Report Now</a>
      </div>
    </div>
  </form>
      

</div> 
<div class="form" id="smsusage-report"></div>
<script type="text/javascript">
$(document).ready(function() {

	$("#sms_start_date").datepicker({
		changeMonth : true,
		changeYear : true,
		dateFormat : "dd/mm/yy",
		maxDate : new Date(),
		onSelect : function(selectedDate) {
			$("#sms_end_date").datepicker("option", "minDate", selectedDate);
		}
	});

	$("#sms_end_date").datepicker({
		changeMonth : true,
		changeYear : true,
		dateFormat : "dd/mm/yy",
		maxDate : new Date(),
		onSelect : function(selectedDate) {
			$("#sms_start_date").datepicker("option", "maxDate", selectedDate);
		}
	});
});


function loadSMSUsageReport(form) {
    $('body').css('cursor', 'wait');
    $('#smsusage-report').html('');
    $.ajax({
      type : "POST",
      url : "/admin/includes/processes/processes-reports.php",
      cache : false,
      data : "action=smsusage&"+$(form).serialize(),
      dataType : "json",
      success : function(data, textStatus) {
        try {
          $('#smsusage-report').prepend(data['html']);
          eval(data['javascript']);
          $('body').css('cursor', 'default');
        } catch (err) {
          $('body').css('cursor', 'default');
        }
      }
    });
}
</script>
{/block} 